<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="../../../views/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>服务包列表</title>
<head>
    <meta charset="utf-8">
    <title>服务包列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">

    <link rel="stylesheet" href="/fdoctor-ms/statics/beginnerAdmin/plugins/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="/fdoctor-ms/statics/beginnerAdmin/plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="/fdoctor-ms/statics/beginnerAdmin/css/btable.css" />
    
    <script type="text/javascript" src="/fdoctor-ms/statics/beginnerAdmin/plugins/layui/layui.js"></script>
    <script type="text/javascript" src="/fdoctor-ms/statics/js/jquery-2.1.4.min.js"></script>
    
</head>

<body style=" background-color: gainsboro;">

    <div style="margin:0px; background-color: white;">
        <blockquote class="layui-elem-quote">
        <form class="layui-form" action="">
        <div class="layui-inline" >
        <label class="layui-form-label" style="width: 150px;font-size: 26px; ">服务包管理</label>
        </div>
       
        <!--     <div class="layui-form-item" align="left" style="margin-left: 0px;margin-top: 10px;">
			  <div class="layui-inline" style="width: 16%;" >
			    <div class="layui-input-inline" ">
			      <select name="oneLevel" id="oneLevel"  lay-verify="" lay-filter="oneLevel">
					  <option value="0">--请选择市(州)--</option>
				      	<c:forEach items="${oneList}" var="item">
				      		<option value="${item.regionCode}">${item.name}</option>
				      	</c:forEach>
					</select>     
			    </div>
			  	</div>
			  	<div class="layui-inline" style="width: 16%;">
			    <div class="layui-input-inline">
			      <select name="twoLevel" id="twoLevel"  lay-verify="" lay-filter="twoLevel">
					  <option value="0">--请选择县(区)--</option>
					</select>     
			    </div>
			    </div>
			    <div class="layui-inline" style="width: 16%;">
			    <div class="layui-input-inline">
			      <select name="threeLevel" id="threeLevel"  lay-verify="" lay-filter="threeLevel">
					  <option value="0">--请选择镇(乡)--</option>
					</select>    
			    </div>
			    </div>
			    <div class="layui-inline" style="width: 20%;">
			    	 <div class="layui-input-inline">
			    	<button class="layui-btn layui-btn-radius" style="width: 100%" id="selectButton" type="button">查询</button>
			    	</div>
			    </div>
			    
			  </div>
			   -->
			</form>
        </blockquote>
		<div class="layui-btn-group">
		<c:if test="${fn:length(sessionScope.user_in_session.orgIds)> 1}">  
		  <button class="layui-btn layui-btn-primary layui-btn-small" id="addButton"><i class="layui-icon">&#xe654;</i>增加</button>
		  <button class="layui-btn layui-btn-primary layui-btn-small" id="updateButton"><i class="layui-icon">&#xe642;</i>编辑</button>
		  <button class="layui-btn layui-btn-primary layui-btn-small" id="deleteButton"><i class="layui-icon">&#xe640;</i>删除</button>
		</c:if> 
		  <!--  <button class="layui-btn layui-btn-primary layui-btn-small" id="detailButton" ><i class="layui-icon">&#xe60a;</i>详情</button>-->
		</div>
        <div id="content" style="width: 100%;height: 500px;"></div>
    </div>

    <script>
    
    	function tableConfig(){
    		layui.config({
                base: '/fdoctor-ms/statics/beginnerAdmin/js/'
            }).use(['btable','layer'], function () {
                var layer = layui.layer;
                
                var btable = layui.btable(),
                    $ = layui.jquery;
                
                //layer.config({
                	//id : Math.ceil(100)	//防止重复弹窗
                //});

                btable.set({
                    elem: '#content',
                    url: '/fdoctor-ms/servicePack/getPackList',
                    type: 'GET',
                    pageSize: 15,
                    columns: [{
                        fieldName: '服务包id',
                        field: 'id',
                        hidden:	true
                    },{
                        fieldName: '服务包名称',
                        field: 'packName'
                    }, {
                        fieldName: '服务人群',
                        field: 'adviceGroup'
                    }, {
                        fieldName: '签约价格 （元/年）',
                        field: 'packPrice'
                    }, {
                        fieldName: '优惠价格 （元/年）',
                        field: 'userPay'
                    }, {
                        fieldName: '服务内容描述',
                        field: 'remarks'
                    }, {
                        fieldName: '服务包种类',
                        field: 'packType',
                        colRender : 'typeRender'
                    }],
                    even: true,
                    //skin: 'row',
                    checkbox: true,
                    field: 'id',
                    paged: true,
                    singleSelect: true,
                    params : {},
                });
                btable.render();

                $('#updateButton').on('click', function () {
                    //获取选择的数据
                    btable.getSelections(function (obj) {
                    	if(obj.count == 0){
                    		layer.msg('请选择要修改的数据',{icon: 7,id : Math.ceil(100)});
                    	}else{
                    		layer.open({
                         		  type: 2,
                         		  title: false,
                         		  id : Math.ceil(100),
                         		  area: ['600px', '400px'],
                         		  closeBtn: 1,
                         		  content: '/fdoctor-ms/servicePack/getPackbyId?id='+obj.ids[0]
                          	});
                    	}
                    });

                });
                
                $('#detailButton').on('click', function () {
                    //获取选择的数据
                    btable.getSelections(function (obj) {
                    	if(obj.count == 0){
                    		layer.msg('请选择要查看详情的数据',{icon: 7,id : Math.ceil(100)});
                    	}else{
                    		
                    	}
                    });

                });
                
                $('#addButton').on('click', function () {
                	layer.open({
               		  type: 2,
               		  title: false,
               		  id : Math.ceil(100),
               		  area: ['650px', '500px'],
               		  closeBtn: 1,
               		  content: '/fdoctor-ms/servicePack/addPack'
                	});
                });
                
                $('#deleteButton').on('click',function (){
                	 //获取选择的数据
                    btable.getSelections(function (obj) {
                    	if(obj.count == 0){
                    		layer.msg('请选择要删除的数据',{icon: 7,id : Math.ceil(100)});
                    	}else{
                    		layer.confirm('确认删除？', {icon: 3,id : Math.ceil(100)}, function(index){
                    			$.ajax({
            						type : 'POST',
            						url : '/fdoctor-ms/servicePack/deletePack',
            						data : {
            							id : obj.ids[0]
            						},
            						success : function(data) {
            							if (data.code == 200) {
            								layer.msg('删除成功！', {
            									icon : 1
            								});
            								tableConfig();
            							} else {
            								layer.msg('删除失败！', {
            									icon : 2
            								});
            							}
            						}
            					});
                   			});
                    	}
                    });
                });

                $(window).on('resize', function (e) {
                    var $that = $(this);
                    $('#content').height($that.height() - 92);
                }).resize();
                
            });
    	}
    	
    	tableConfig();
    
    	//查询按钮声明点击事件，查询逻辑
        $('#selectButton').on('click', function(){
        	tableConfig();
        });
  	  	 //初始化表单控件
		layui.use(['jquery', 'form'], function() {
		     $ = layui.jquery;
		     form = layui.form();
		     $form = $('form');
		     
		   //给联动下拉框声明选中事件
		     form.on('select(oneLevel)', function(data) {
		    	 if(data.value != '0'){
		    		 $.ajax({
				 			type : 'GET',
				 			url : '/fdoctor-ms/servicePack/getChild',
				 			data : {
				 				regionCode : data.value
				 			},
				 			success : function(data) {
				 				var proHtml = '';
				 				for(i = 0; i < data.length; i++){
				 					proHtml += '<option value="'+data[i].regionCode+'">'+data[i].name+'</option>';
				 				}
				 				$('#twoLevel').html('<option value="0">--请选择县(区)--</option>');
				 				$('#twoLevel').append(proHtml);
				 				form.render();
				 			}
				 	});
		    	 }else{
		    		 $('#twoLevel').html('<option value="0">--请选择上级--</option>');
		    		 form.render();
		    	 }
		     });
		   
		     form.on('select(twoLevel)', function(data) {
		    	 if(data.value != '0'){
		    		 $.ajax({
				 			type : 'GET',
				 			url : '/fdoctor-ms/servicePack/getChild',
				 			data : {
				 				regionCode : data.value
				 			},
				 			success : function(data) {
				 				var proHtml = '';
				 				for(i = 0; i < data.length; i++){
				 					proHtml += '<option value="'+data[i].regionCode+'">'+data[i].name+'</option>';
				 				}
				 				$('#threeLevel').html('<option value="0">--请选择镇(乡)--</option>');
				 				$('#threeLevel').append(proHtml);
				 				form.render();
				 			}
				 	});
		    	 }else{
		    		 $('#threeLevel').html('<option value="0">--请选择上级--</option>');
		    		 form.render();
		    	 }
		     });
		     
		     
		   
		});
		function typeRender(data){
        	if(data == '1'){
        		return '基础服务';
        	}else if(data == '2'){
        		return '增值服务';
        	}else{
        		return data;
        	}
        }
    </script>
</body>
</html>